<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>OA协同办公系统</title>
	</head>
	<style type="text/css">
.divuser {
	background: #EBEBEB;
	width: 550px;
	height: 350px;
	border: #CCC double 2px
}
</style>
	<link type="text/css" rel="stylesheet" href="css/table.css">
	<link rel="stylesheet" href="js/easyui/themes/default/easyui.css" />
	<link rel="stylesheet" href="js/easyui/themes/icon.css" />
	<script type="text/javascript" src="js/easyui/jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="js/easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="js/select.js"></script>
	<script type="text/javascript">
		$(function(){
             $('#tt2').tree({   
                  checkbox: false,   
                 url: 'organizationTree.action',   
                  onBeforeExpand:function(node,param){
                      $('#tt2').tree('options').url = "organizationChildTree.action?orgId="+ node.id;// change the url                       
                     
                  },               
                  onClick:function(node){
						$('#tt2').tree('options').url = "organizationChildTree.action?orgId="+ node.id;// change the url              
                       getOrg(node.id);
                  }   
              });   
              var obj = document.getElementById("obj2");
	       var initvalue = eval("["+opener.getOldValue()+"]");
	    if(initvalue!=''&&initvalue!=undefined){
	    	addAll(obj,initvalue);
	    }
         }); 
		
function getOrg(id){
	var  param={"organizationId":id};
	$.post("getUserOrg.action",param,function(data){
		var list=data.userList;
		var obj1=document.getElementById("obj1");
		clear(obj1);
		for(var i=0;i<list.length;i++){
			addItem(obj1,list[i].id,list[i].name);
		}
	},"json");

}
function func1(){
	var from = document.getElementById("obj1");
	var to = document.getElementById("obj2");
	moveTo(from,to);
	}
	function func2(){
	var from = document.getElementById("obj2");
	var to = document.getElementById("obj1");
	moveTo(from,to);
	}
	function func3(){
	var from = document.getElementById("obj1");
	var to = document.getElementById("obj2");
	moveAll(from,to);
	}
	function func4(){
	var from = document.getElementById("obj2");
	var to = document.getElementById("obj1");
	moveAll(from,to);
	}

 function addUser(){
	var obj = document.getElementById("obj2");
	  var array = getSelectArray(obj);
	  opener.setValue(array);
	  window.close();
}

</script>
	<body>
		<table align="center">
			<tr>
				<td>
					<div class="divuser">
						<h1
							style="background: url(image/usebg.jpg); height: 30px; margin: 0; text-align: center; line-height: 30px; font-size: 16px">
							选择用户
						</h1>
						<div id="tree-div"
							style="float: left; width: 180px; height: 320px; border: #666 double 1px; overflow-y: auto; overflow-x: none; word-break: break-all;">
							<ul id="tt2">

							</ul>
						</div>
						<div
							style="width: 350px; height: 320px; border: #666 double 1px; float: right; overflow-y: auto;">
							<table border="0">

								<tr>
									<td>
										<select name="possible" id="obj1" size="4" MULTIPLE
											style="width: 130px; height: 310px;">

										</select>
									</td>
									<td>
										<input type="button" onclick="func1()" class="button_02"
											value=">" >
										<input type="button" onclick="func3()" class="button_02"
											value=">>" >
										<br>
										<br>
										<input type="button" class="button_02" onclick="func2()"value="<">
                  <input type="button" width="25px" onclick="func4()" class="button_02" value="<<">
                  <br /><br />
                  <input type="button" onclick="addUser()" width="25px" class="button_02" value="确定" >
				</td>
                <td>
                  <select name="chosen" id="obj2" size="4" MULTIPLE style="width: 130px;height:310px">
                     
                  </select>
                </td>
              </tr>  
            </table>
</div>
</div>
</td></tr></table>
</body>
</html>